<template>
	<div id="order_list">
		<!-- <p class="demo">选择平台后，可进行表格导出导入（快递助手模板，读取表格模板需包含以下列：<span>收件电话、收件人、快递单号</span>）<a href="../../static/html/demo.html" target="_blank" class="course">点击查看视频演示</a></p> -->
		<el-form :inline="true" size="medium">
			<el-form-item>
				<el-select v-model="params.status" placeholder="选择任务状态" @change="search">
					<el-option
					v-for="item in typeList"
					:key="item.value"
					:label="item.label"
					:value="item.value">
					</el-option>
				</el-select>
			</el-form-item>
			<el-form-item>
				<el-select v-model="params.storeId" placeholder="仓库"  @change="search" clearable>
					<el-option
					v-for="item in storeList"
					:key="item.value"
					:label="item.name"
					:value="item.id">
					</el-option>
				</el-select>
			</el-form-item>
			<el-form-item>
				<el-select v-model="params.tenantId" placeholder="选择分站" @change="search" clearable>
					<el-option v-for="item in tenantList" :label="item.company" :value="item.id"></el-option>
				</el-select>
			</el-form-item>
			<el-form-item>
				<el-input v-model="params.busId" placeholder="请输入商家Id"></el-input>
			</el-form-item>
			<el-form-item>
				<el-input v-model="params.orderId" placeholder="请输入订单号"></el-input>
			</el-form-item>
			<el-form-item>
				<el-button type="primary" @click="search">搜索</el-button>
				<!-- <el-button type="primary" @click="pushStatus">更新订单推送状态</el-button> -->
			</el-form-item>

		</el-form>

		<el-table :data="list" v-loading="loading" stripe>
			<el-table-column
				prop="id"
				fixed
				align="center"
				label="订单号">
			</el-table-column>
			<el-table-column
				prop="status"
				align="center"
				label="订单状态">
				<template slot-scope="scope">
					<p v-if="scope.row.status == 1">处理中</p>
					<p v-else-if="scope.row.status == 0">待付款</p>
					<p v-else-if="scope.row.status == 2">可发货</p>
					<p v-else-if="scope.row.status == 3">发货完成</p>
					<p v-else-if="scope.row.status == 4">任务完成</p>
				</template>
			</el-table-column>
			<el-table-column
				prop="bus_id"
				align="center"
				show-overflow-tooltip
				label="商家Id">
			</el-table-column>
			<el-table-column
				label="分站"
				align="center">
				<template slot-scope="scope">
					<span v-for="item in tenantList" v-if="item.id == scope.row.tenant_id">{{item.company}}</span>
				</template>
			</el-table-column>
			<el-table-column
				label="仓库"
				align="center">
				<template slot-scope="scope">
					<span v-for="item in storeList" v-if="item.id == scope.row.store_id">{{item.name}}</span>
				</template>
			</el-table-column>
			<el-table-column
				prop="platform"
				align="center"
				show-overflow-tooltip
				label="平台类型">
				<template slot-scope="scope">
					<p v-if="scope.row.belong_terrace == 1">其他</p>
					<p v-else-if="scope.row.belong_terrace == 2">淘宝/天猫</p>
					<p v-else-if="scope.row.belong_terrace == 3">京东</p>
					<p v-else-if="scope.row.belong_terrace == 4">拼多多</p>
					<p v-else-if="scope.row.belong_terrace == 5">抖音</p>
				</template>
			</el-table-column>
			<el-table-column
				prop="importType"
				align="center"
				label="方式"
				width="120px">
				<template slot-scope="scope">
					<p v-if="scope.row.import_type == 1">智能筛选发货</p>
					<p v-else-if="scope.row.import_type == 2">表格导入发货</p>
					<p v-else-if="scope.row.import_type == 3">手工下单</p>
					<p v-else-if="scope.row.import_type == 4">拼多多一键下单</p>
					<p v-else-if="scope.row.import_type == 5">淘宝一键下单</p>
					<p v-else-if="scope.row.import_type == 6">抖音一键下单</p>
				</template>
			</el-table-column>
			<el-table-column
				prop="pk_count"
				align="center"
				label="包裹数">
			</el-table-column>
			<el-table-column
				prop="amount"
				align="center"
				label="支付金额">
			</el-table-column>
			<el-table-column
				prop="other_type"
				align="center"
				label="推送类型">
				<template slot-scope="scope">
					<p v-if="scope.row.other_type == 1">自有仓库</p>
					<p v-if="scope.row.other_type == 2">爱代发</p>
					<p v-if="scope.row.other_type == 3">就代发</p>
					<p v-if="scope.row.other_type == 4">瑶瑶</p>
					<p v-if="scope.row.other_type == 5">星辰</p>
					<p v-if="scope.row.other_type == 6">海淘</p>
					<p v-if="scope.row.other_type == 7">代发发</p>
				</template>
			</el-table-column>
			<!-- <el-table-column
				prop="otherStatus"
				align="center"
				label="订单推送状态"
				width="120px">
				<template slot-scope="scope">
					<p v-if="scope.row.otherType == 5"> </p>
					<p v-else-if="scope.row.otherStatus == -1">不可推送</p>
					<p v-else-if="scope.row.otherStatus == 0">未推送</p>
					<p v-else-if="scope.row.otherStatus == 1">已推送</p>
					<p v-else-if="scope.row.otherStatus == 2">推送失败</p>
				</template>
			</el-table-column>
			<el-table-column
				show-overflow-tooltip
				prop="otherReason"
				align="center"
				label="推送失败原因">
			</el-table-column> -->
			<el-table-column
				align="center"
				label="支付时间"
				min-width="110px">
				<template slot-scope="scope">
					<p>{{scope.row.pay_time?$moment(scope.row.pay_time).format('Y-MM-DD HH:mm'):'--'}}</p>
				</template>
			</el-table-column>
			<el-table-column
				align="center"
				label="创建时间"
				min-width="110px">
				<template slot-scope="scope">
					<p>{{$moment(scope.row.create_time).format('Y-MM-DD HH:mm')}}</p>
				</template>
			</el-table-column>
			<el-table-column label="操作" align="center">
				<template slot-scope="scope">
					<el-button @click="toPackage(scope.row.id)" type="text">查看包裹</el-button>
					<el-button @click="finish(scope.row)" type="text" v-if="scope.row.status==1||scope.row.status==2 || scope.row.status==3">发货</el-button>
				</template>
			</el-table-column>
		</el-table>

		<el-pagination
			class="page"
			background
			@size-change="handleSizeChange"
			@current-change="getNewList"
			:current-page.sync="params.pageNo"
			:page-sizes="[10, 20, 50, 100]"
			:page-size="params.pageSize"
			layout="total, sizes, prev, pager, next, jumper"
			:total="total">
		</el-pagination>
	</div>
</template>

<script>
	export default {
		data() {
			return {
				params: {
					pageNo: 1,
					pageSize: 10,
					isCount: true,
					storeId:'',
					busId: '',
					orderId: '',
					status: '',
					belongTerrace: '',
					startTime: '',
					endTime: '',
					oldType:1,
				},
				list: [],
				total: 0,
				loading: false,
				selectData: [],
				typeList: [
					{ value: 1, label: '处理中' },
					{ value: 0, label: '待付款' },
					{ value: 2, label: '可发货' },
					{ value: 3, label: '发货完成' },
					{ value: 4, label: '任务完成' },
					{ value: '', label: '全部状态' },
				],
				platformList: [
					{ value: 2, label: '淘宝/天猫' },
					{ value: 3, label: '京东' },
					{ value: 4, label: '拼多多' },
					{ value: 5, label: '抖音' },
					{ value: 1, label: '其他' },
				],
				oldTypeList: [
					{ value: 1, label: '新数据' },
					{ value: 2, label: '旧数据' },
				],
				tenantList: [],
				timeArr: [],
				storeList: []
			};
		},

		watch: {},

		created(){
			this.getTenantList()
			this.getAllStoreList()
		},

		mounted(){
			this.search();
		},

		methods:{
			getAllStoreList(){
				this.$request.post({
					url: '/ReportApi/admin/storetlist',
					success: res => {
						this.storeList = res
					}
				})
			},
			timeChange(val){
				if(val){
					this.params.startTime = this.$common.getDate(val[0]);
					this.params.endTime = this.$common.getDate(val[1]);
				}else{
					this.params.startTime = ''
					this.params.endTime = ''
				}
			},
			getTenantList(){
				this.$request.post({
					url: '/ReportApi/admin/tenantlist',
					success: res => {
						this.tenantList = res
					}
				})
			},
			handleSizeChange(value) {
				this.params.pageSize = value
				//this.search()
				this.params.pageNo = 1
				this.params.isCount = true
				this.getNewList();
			},

			search(){
				this.params.pageNo = 1
				this.params.isCount = true
				//this.getList();
				this.getNewList();
				this.getCount();
			},

			// getList() {
			// 	this.loading = true
			// 	this.$request.post({
			// 		url: 'ad/order/list',
			// 		params: this.params,
			// 		success: result =>{
			// 			this.list = result.list
			// 			if(this.params.isCount){
			// 				this.params.isCount = false
			// 				this.total = result.total
			// 			}
			// 		},
			// 		finally: ()=>{
			// 			this.loading = false
			// 		}
			// 	})
			// },
			getNewList() {
				this.loading = true
				this.$request.post({
					url: '/ReportApi/admin/orderlist',
					params: this.params,
					success: result =>{
						this.list = result[0]
						this.total = result[1]
					},
					finally: ()=>{
						this.loading = false
					}
				})
			},
			// getCount() {
			// 	this.$request.post({
			// 		url: 'ad/order/count',
			// 		params: this.params,
			// 		success: result =>{
			// 			this.total = result
			// 		},
			// 		finally: ()=>{
			// 		}
			// 	})
			// },

			toPackage(id) {
				this.$router.push({
					path: '/order/package',
					query: {id: id,oldType:this.params.oldType}
				})
			},
			finish(row){
				this.$confirm('确认完成，一旦订单完成，则订单下的包裹都不可进行退款?', '确认完成',{
				confirmButtonText: '确定',
				cancelButtonText: '取消',
				type: 'warning'
				}).then(() => {
					this.loading = true
					this.$request.post({
						url: '/ReportApi/admin/finsh',
						params: {id:row.id},
						success: result =>{
							this.$message.success('确认成功');
							row.status = 4;
						},
						finally: ()=>{
							this.loading = false
						}
					})
				}).catch(() => {
				});
			},

			pushStatus(){
				this.$confirm('确定将推送失败的订单改为未推送状态，更新之后，订单可重新进行推送?', '更新订单推送状态',{
				confirmButtonText: '确定',
				cancelButtonText: '取消',
				type: 'warning'
				}).then(() => {
					this.loading = true
					this.$request.post({
						url: 'ad/order/pushStatus',
						params: {},
						success: result =>{
							this.$message.success('更新成功');
							//this.getList();
							this.getNewList();
						},
						finally: ()=>{
							this.loading = false
						}
					})
				}).catch(() => {
				});
			}
		},

		beforeDestroy() {}
	}
</script>

<style>

</style>

<style lang="scss" scoped>
	.page{
		text-align: right;
		margin-top: 20px;
	}
	.demo{
		margin-bottom: 10px;
		font-size: 14px;
		color: #666666;
	}
	.demo span{
		color: rgb(255, 208, 75);
	}
	.demo a{
		color: red;
		margin-left: 10px;
	}
</style>
